import {Fragment} from 'react';
import {useTheme} from '@emotion/react';

import type {SVGIconProps} from './svgIcon';
import {SvgIcon} from './svgIcon';

function IconTap(props: SVGIconProps) {
  const theme = useTheme();
  return (
    <SvgIcon {...props} kind={theme.isChonk ? 'stroke' : 'path'}>
      {theme.isChonk ? (
        <Fragment>
          <path d="m3.71,6c0-2.07,1.68-3.75,3.75-3.75s3.75,1.68,3.75,3.75" />
          <path d="m6.21,6c0-.69.56-1.25,1.25-1.25h0c.69,0,1.25.56,1.25,1.25v2.5h1.79c1.27,0,2.22,1.17,1.96,2.41l-.16.75c-.19.93-1.01,1.59-1.96,1.59h-4.06c-.53,0-1.04-.21-1.41-.59l-1.29-1.29c-.48-.48-.48-1.27,0-1.75h0c.48-.48,1.27-.48,1.75,0l.88.88v-4.5Z" />
        </Fragment>
      ) : (
        <path d="M8,15.95c-4.23,0-6.57-2.59-6.6-7.3,0-.02,0-.05,0-.07V2.26c0-1.22.99-2.21,2.21-2.21s2.21.99,2.21,2.21v1.27c.22-.08.46-.12.71-.12,1.01,0,1.87.68,2.13,1.61.25-.09.52-.15.8-.15,1.01,0,1.86.68,2.13,1.61.25-.09.51-.15.79-.15,1.19,0,2.17.95,2.21,2.13,0,.03,0,.06,0,.09,0,4.76-2.34,7.38-6.59,7.38ZM2.9,8.5s0,.05,0,.07c0,3.95,1.67,5.88,5.09,5.88s5.08-1.9,5.1-5.81c0-.03,0-.05,0-.08,0-.39-.32-.71-.71-.71-.36,0-.66.27-.71.61v.22c0,.4-.32.74-.73.75-.4-.02-.75-.3-.77-.7v-.11c0-.06,0-.11,0-.17v-1.34c0-.39-.32-.71-.71-.71s-.71.32-.71.71v1.58c0,.41-.34.75-.75.75s-.75-.34-.75-.75v-3.04c0-.39-.32-.71-.71-.71s-.71.32-.71.71v3.04c0,.41-.34.75-.75.75s-.75-.34-.75-.75V2.26c0-.39-.32-.71-.71-.71s-.71.32-.71.71v6.23Z" />
      )}
    </SvgIcon>
  );
}

IconTap.displayName = 'IconTap';

export {IconTap};
